<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Dashboard</title>
<meta name="viewport"
    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="shortcut icon" href="assets/imgs/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="assets/css/bootstrap.css" />
<link rel="stylesheet" href="assets/css/sog.min.css" />
<link rel="stylesheet" href="assets/css/dashboard.css" />
<link rel="stylesheet" href="assets/css/nv.d3.css" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="page-body">
    <div class="page-container">
        
        <div class="sidebar-menu toggle-others fixed">

        <div class="sidebar-menu-inner">

            <header class="logo-env">
            <div class="logo">
                <a href="/" class="logo-expanded"> <img class="logo-img"
                    src="assets/imgs/emqlogo-green.png" alt="logo"/>
                    <span>Dashboard</span>
                </a>
                <a href="/" class="logo-collapsed"> <img class="logo-img"
                    src="assets/imgs/emqlogo-white.png" alt="logo"/>
                </a>
            </div>

            <div class="mobile-menu-toggle visible-xs">
                <a href="#" data-toggle="user-info-menu"> <i class="glyphicon glyphicon-user"></i>
                </a> <a href="#" data-toggle="mobile-menu"> <i class="glyphicon glyphicon-menu-hamburger"></i>
                </a>
            </div>
            </header>

            <ul id="main-menu" class="main-menu">
                <li module="overview"><a href="/#/overview"> <i
                        class="dash-icon dash-icon-overview"></i> <span class="title">Overview</span>
                </a></li>
                <li module="alarms"><a href="/#/alarms"> <i
                        class="dash-icon dash-icon-alarms"></i> <span class="title">Alarms</span>
                </a></li>
                <li module="clients"><a href="/#/clients">
                        <i class="dash-icon dash-icon-clients"></i> <span class="title">Clients</span>
                </a></li>
                <li module="sessions"><a href="/#/sessions"> <i
                        class="dash-icon dash-icon-sessions"></i> <span class="title">Sessions</span>
                </a></li>
                <li module="topics"><a href="/#/topics"> <i
                        class="dash-icon dash-icon-topics"></i> <span class="title">Topics</span>
                </a></li>
                <li module="routes"><a href="/#/routes"> <i
                        class="dash-icon dash-icon-routes"></i> <span class="title">Routes</span>
                </a></li>
                <li module="subscriptions"><a href="/#/subscriptions"> <i
                        class="dash-icon dash-icon-subscriptions"></i> <span class="title">Subscriptions</span>
                </a></li>
                <li module="plugins"><a href="/#/plugins"> <i
                        class="dash-icon dash-icon-plugins"></i> <span class="title">Plugins</span>
                </a></li>
                <li module="websocket"><a href="/#/websocket"> <i
                        class="dash-icon dash-icon-websocket"></i> <span class="title">Websocket</span>
                </a></li>
                <li module="users"><a href="/#/users"> <i
                        class="dash-icon dash-icon-admins"></i> <span class="title">Admins</span>
                </a></li>
                <li module="http_api"><a href="/#/http_api"> <i
                        class="dash-icon dash-icon-http-api"></i> <span class="title">HTTP API</span>
                </a></li>
            </ul>

        </div> <!-- /.sidebar-menu-inner -->

        </div> <!-- /.sidebar-menu -->
        
        <div class="main-content">
        
            <nav class="navbar user-info-navbar" role="navigation">
            <!-- Left links for user info navbar -->
            <ul class="user-info-menu left-links list-inline list-unstyled">
                <li class="hidden-sm hidden-xs"><a href="#"
                    data-toggle="sidebar"> <i class="glyphicon glyphicon-th-list"></i>
                </a></li>
            </ul>

            <!-- Right links for user info navbar -->
            <ul class="user-info-menu right-links list-inline list-unstyled">
                <li><a>
                <span id="current_node"> Localhost</span>
                </a></li>
                <li class="dropdown user-profile">
                <a><img src="assets/imgs/user-4.png"
                        alt="user-image" class="img-circle img-inline userpic-32"
                        width="28" />
                <span> <b id="current_user">Admin</b></span>
                </a>
                </li>
                <li>
                <a href="javascript:;" id="logout">
                <span><i class="glyphicon glyphicon-lock"></i> Logout</span></a>
                </li>
            </ul>
            </nav>

            <!-- main center -->
            <div id="main_center">
                <div id="dashboard_overview" class="collapse"></div>
                <div id="dashboard_plugins" class="collapse"></div>
                <div id="dashboard_clients" class="collapse"></div>
                <div id="dashboard_sessions" class="collapse"></div>
                <div id="dashboard_topics" class="collapse"></div>
                <div id="dashboard_routes" class="collapse"></div>
                <div id="dashboard_subscriptions" class="collapse"></div>
                <div id="dashboard_alarms" class="collapse"></div>
                <div id="dashboard_websocket" class="collapse"></div>
                <div id="dashboard_users" class="collapse"></div>
                <div id="dashboard_http_api" class="collapse"></div>
            </div>
            
            <!-- Main Footer -->
            <footer class="main-footer sticky footer-type-1">
            <div class="footer-inner">
                <!-- Add your copyright text here -->
                <div class="footer-text">
                    &copy; 2012 -
                    <script type="text/javascript">
                        document.write(new Date().getFullYear());
                    </script>
                    Powered by <strong> <a href="http://emqtt.io"
                        target="_blank" title="emqtt">eMQTT.IO</a></strong>
                </div>

                <div class="go-up">
                    <a href="javascript:;" rel="go-top"> <i class="glyphicon glyphicon-chevron-up"></i></a>
                </div>
            </div>
            </footer>
        
        </div>
        
    </div>
</body>
<!-- Bottom Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.js"></script>
<script src="assets/js/mqttws31.js"></script>
<script src="assets/js/toastr/toastr.min.js"></script>
<script src="assets/js/TweenMax.min.js"></script>
<script src="assets/js/joinable.js"></script>
<script src="assets/js/vue.js"></script>
<script src="assets/js/sog.js"></script>
<script src="assets/js/d3.js"></script>
<script src="assets/js/nv.d3.js"></script>
<!-- JavaScripts initializations and stuff -->
<script src="assets/js/dashboard.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function($) {
        dashboard.init(document.location.href);
    });
</script>
</html>
